<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML data</title>
    <script type="text/javascript">
        $(function () {
            $("a").click(function () {
                var url = this.href;
                var args = {"time": new Date()};

                //url:
                //args:json格式
                //function：回调函数，当响应结束时，回调函数被触发，响应结果在data中
                $.getJSON(url, args, function (data) {
                    var name = data.person.name;
                    var email = data.person.email;
                    var note = data.person.note;

                    $("#details").empty()
                        .append("<h4><a href='mailto:'" + email + ">" + name + "</a></h4>")
                        .append("<p style='color: #e255d1'>" + note + "</p>");
                });
                return false;
            })
        })
    </script>
</head>
<body>
<h1>People</h1>
<ul>
    <li>
        <a href="jsfiles/andy.js">Andy</a>
    </li>
    <li>
        <a href="jsfiles/richard.js">Richard</a>
    </li>
    <li>
        <a href="jsfiles/jeremy.js">Jeremy</a>
    </li>
</ul>
<div id="details"></div>
</body>
</html>